<template>
  <div class="patnerDetail">
    <div class="pc">
      <self-title :userName="username + name"></self-title>
      <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        class="advTable"
        stripe
        :header-cell-style="{background:'#eef1f6',color:'#606266'}"
      >
        >
        <el-table-column label="序号" prop="index" type="index" align="center"></el-table-column>
        <el-table-column label="项目名称" prop="projectName" type="projectName" align="center"></el-table-column>
        <el-table-column label="所属企业" prop="industry" type="industry" align="center"></el-table-column>
        <el-table-column label="负责角色" prop="position" type="position" align="center"></el-table-column>
        <el-table-column label="状态" prop="status" type="status" align="center">
          <template slot-scope="scope">
            <p v-if="scope.row.status=='1'">禁用</p>
            <p v-if="scope.row.status=='0'">启用</p>
          </template>
        </el-table-column>
        <el-table-column prop="enterpriseEvaluation" label="(企业)评价" align="center">
          <template slot-scope="{row}">
            <div v-if="row.enterpriseScore !== 0">
              <el-rate
                disabled
                v-model="row.enterpriseScore"
                :colors="colors"
                score-template="{row.enterpriseScore}"
              ></el-rate>
            </div>
            <div v-if="row.enterpriseScore === 0">
              <el-button type="text">暂无评分</el-button>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="comprehensiveEvaluation" label="(管理员)综合评价" align="center">
          <template slot-scope="{row}">
            <div v-if="row.adminScore !== 0">
              <el-rate
                disabled
                v-model="row.adminScore"
                :colors="colors"
                score-template="{row.adminScore}"
              ></el-rate>
            </div>
            <div v-if="row.adminScore === 0">
              <el-button type="text">暂无评分</el-button>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="100" align="center">
          <template slot-scope="scope">
            <el-button @click="deleteProject(scope.row.projectId)" type="text" size="small">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="phone">
      <van-cell-group>
        <van-cell title="姓名" :value="dataList.userInfo.name" />
        <!-- <van-cell title="性别" :value="dataList.sex" /> -->
        <van-cell title="联系邮件" :value="dataList.email" />
        <van-cell title="手机号" :value="dataList.telephone" />
        <van-cell title="状态" :value="dataList.status">
          <template>
            <p v-if="dataList.status=='-1'">禁用</p>
            <p v-if="dataList.status=='0'">启用</p>
          </template>
        </van-cell>
        <van-cell title="出生日期" :value="dataList.userInfo.brithday" />
        <van-cell title="学历" :value="dataList.userInfo.education" />
        <van-cell title="毕业院校" :value="dataList.userInfo.graduatedFrom" />
        <van-cell title="学历" :value="dataList.userInfo.education" />
        <van-cell title="专业" :value="dataList.userInfo.major" />
        <van-cell title="学历" :value="dataList.userInfo.education" />
        <van-cell title="照片">
          <el-image style="width: 70px; height: 70px" :src="dataList.userInfo.photoUrl"></el-image>
        </van-cell>
        <van-cell title="服务方向" :value="dataList.userInfo.serviceDirection" />
        <van-cell title="从业经验" :value="dataList.userInfo.industryExperience" />
        <van-cell title="擅长领域" :value="dataList.userInfo.expertise" />
        <!-- <van-cell title="期望报酬" :value="dataList.expectedReward" />
        <van-cell title="可用周期" :value="dataList.availablePeriod" />-->
        <!-- <div class="grade">
          <van-cell title="(企业)评价" value style="width:70%" />
          <van-rate v-model="dataList.value1" color="#ffd21e" :size="15" />
        </div>-->
        <div class="grade">
          <van-cell title="(管理员)评价" value style="width:70%" />
          <div v-if="dataList.value2 !== 0">
            <van-rate v-model="dataList.value2" color="#ffd21e" :size="15" />
          </div>
          <div v-if="dataList.value2 === 0">
            <el-button type="text">暂无评分</el-button>
          </div>
        </div>
        <div class="grade">
          <van-cell title="操作" value>
            <el-button @click="deleteClick(dataList.id)" type="text" size="small">删除</el-button>
            <!-- <el-button @click="deleteClick(dataList.id)" type="text" size="small">禁用</el-button> -->
            <el-button
              v-if="dataList.status===0"
              @click="disableClick(dataList.id,dataList.status)"
              type="text"
              size="small"
            >禁用</el-button>
            <el-button
              v-if="dataList.status===-1"
              @click="enableClick(dataList.id,dataList.status)"
              type="text"
              size="small"
            >启用</el-button>
          </van-cell>
        </div>
        <div class="grade">
          <van-cell title="评分" value style="width:60%" />
          <div class="reqAllAssess">
            <i @click="jumpAssess" style="color: #409EFF" class="el-icon-remove-outline"></i>
          </div>
        </div>
        <van-cell title="参与项目" value />
        <van-collapse v-model="activeNames" class="program">
          <div v-for="(item,index) in tableData" :key="index">
            <van-collapse-item :title="item.projectName">
              <van-cell title="所属企业" :value="item.industry" />
              <van-cell title="负责角色" :value="item.position" />
              <div class="grade">
                <van-cell title="(企业)综合评价" value />
                <div v-if="item.enterpriseScore !== 0">
                  <van-rate v-model="item.enterpriseScore" color="#ffd21e" :size="15" />
                </div>
                <div v-if="item.enterpriseScore === 0">
                  <el-button type="text">暂无评分</el-button>
                </div>
              </div>
              <div class="grade">
                <van-cell title="(管理员)综合评价" value />
                <div v-if="item.adminScore !== 0">
                  <van-rate v-model="item.adminScore" color="#ffd21e" :size="15" />
                </div>
                <div v-if="item.adminScore === 0">
                  <el-button type="text">暂无评分</el-button>
                </div>
              </div>
              <div class="grade">
                <van-cell title="操作" value>
                  <el-button @click="deleteProject(item.projectId)" type="text" size="small">删除</el-button>
                </van-cell>
              </div>
            </van-collapse-item>
          </div>
        </van-collapse>
      </van-cell-group>
    </div>
  </div>
</template>

<script>
import selfTitle from "../../../components/SelfTitle";
import tableItem from "../../../components/tableItem";
import { ReqDelete, ReqDeletePro } from "../../../request/index";
import { ReqProhibit } from "../../../request/index";
import { ReqProject } from "../../../request/index";
export default {
  components: {
    selfTitle,
    tableItem
  },
  data() {
    return {
      colors: ["#99A9BF", "#F7BA2A", "#FF9900"],
      activeNames: ["1"],
      username: "个人顾问 ———— ",
      name: this.$route.query.info.userInfo.name,
      value: 0,
      tableData: [],
      dataList: this.$route.query.info,
      operate: [
        {
          text: "删除",
          value: 0
        },
        {
          text: "禁用",
          value: 1
        }
      ]
    };
  },
  methods: {
    //删除个人顾问
    async deleteClick(id) {
      let data = [id];
      let result = await ReqDelete(data);
      if (result.msg === "success") {
        this.$message({
          showClose: true,
          message: "恭喜你，删除成功",
          type: "success"
        });
        this.$router.push("/self/partner/partIndex");
      } else {
        this.$message({
          showClose: true,
          message: "删除失败",
          type: "error"
        });
      }
    },
    //获取项目
    async getTableList() {
      let data = {
        personalId: this.$route.query.info.id
      };
      let List = await ReqProject(data);
      this.tableData = List.PersonalProjectVoList;
      // console.log(this.tableData);
    },
    //禁用
    async disableClick(id, status) {
      let data = {
        id: id,
        status: 1
      };
      let disableInfo = await ReqProhibit(data);
      if (disableInfo.msg === "success") {
        this.$message({
          showClose: true,
          message: "恭喜你，禁用成功",
          type: "success"
        });
        this.$router.push("/self/partner/partIndex");
      } else {
        this.$message({
          showClose: true,
          message: "禁用失败",
          type: "error"
        });
      }
    },
    //解除禁用
    async enableClick(id, status) {
      let data = {
        id: id,
        status: 0
      };
      let disableInfo = await ReqProhibit(data);
      if (disableInfo.msg === "success") {
        this.$message({
          showClose: true,
          message: "恭喜你，解除禁用成功",
          type: "success"
        });
        this.$router.push("/self/partner/partIndex");
      } else {
        this.$message({
          showClose: true,
          message: "解除禁用失败",
          type: "error"
        });
      }
    },
    //删除个人顾问下的项目
    async deleteProject(id) {
      let formData = new FormData();
      formData.append("id", id);
      let result = await ReqDeletePro(formData);
      if (result.msg === "success") {
        this.$message({
          showClose: true,
          message: "恭喜你，删除成功",
          type: "success"
        });
        this.$router.push("/self/partner/partIndex");
      } else {
        this.$message({
          showClose: true,
          message: "删除失败",
          type: "error"
        });
      }
    },
    //跳转评分界面
    jumpAssess() {
      this.$router.push({
        path: "/self/parnter/selfAssessment",
        query: {
          id: this.$route.query.info.id
        }
      });
    }
  },
  async created() {
    await this.getTableList();
  }
};
</script>

<style scoped>
.patnerDetail {
  width: 90%;
  margin: 0 auto;
}
.patnerDetail .phone {
  display: none;
}
.patnerDetail .pc .self-title {
  padding: 0 !important;
}
img{
  padding: 0 !important;
}
@media screen and (max-width: 420px) {
  .patnerDetail .pc {
    display: none;
  }
  .patnerDetail .phone {
    display: block;
  }
}
.patnerDetail .phone .grade {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.patnerDetail .phone .program {
  background: #daeef6;
  margin-left: 15px;
}
</style>
